import ReactDOM from 'react-dom'
import { Component } from 'react'
// 类组件定义状态
class App extends Component {
  // 受控组件
  state = {
    mobile: 13122894455,
    isAgree: true
  }
  changeMobile = (e) => {
    // console.log(e.target.value)
    this.setState({
      mobile: e.target.value
    })
  }
  // isAgree = (e) => {
  //   this.setState({
  //     isAgree: e.target.checked
  //   })
  // }
  render() {
    return (
      <div>
        <div>
          <input type="text"
            onChange={this.changeMobile}
            value={this.state.mobile}
            placeholder='请输入手机号' />
        </div>
        <div>
          {/* <input type="checkbox" 
          onChange={this.isAgree} 
          checked={this.state.isAgree} />请同意用户隐私 */}
          <input type="checkbox"
            onChange={(e) => this.setState({ isAgree: e.target.checked })}
            checked={this.state.isAgree} />请同意用户隐私
        </div>
      </div>
    )
  }
}
ReactDOM.render(<App />, document.getElementById('root'))